<template>
	<view class="content">
		<view class="utop" :style="{'padding-top':statusBarHeight+'px'}">
			<view class="u_left" @click="openInfo">
				<image src="/static/uimg.png" mode=""></image>
				<view class="texts">
					{{uname}}
				</view>
			</view>
			<view class="">
				<view class="charts_right">
					<view class="active_rea" @click="isshow1=!isshow1">
						<view class="texts">
							{{utype}}
						</view>
						<uni-icons color="#316FFC" type="down"></uni-icons>
					</view>
					<view class="active_ads" v-show="isshow1">
						<view class="items" v-for="(item,index) in DepartmentList" :key="index"
							@click="changeType(item)">
							<view class="" :class="utype == item.text?'activetext':''">
								{{ item.text}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="" :style="{'height':statusBarHeight+20+'px'}"></view>
		<view class="smimg" @click="sm">
			<image src="../../static/sm.png" mode=""></image>
		</view>

		<view class="btn_block">
			<view class="items_flex" v-if="utype!='续料'">
				<view :class="item.cname || item.id==1 ?'itemsact':'items'" v-for="(item,index) in btnList"
					:key="index">
					{{item.name}}
				</view>
			</view>
			<view class="input_flex">
				<input @confirm="handleSearch(code)" v-model="code" type="text" class="input" placeholder="请输入编码" />
			<!-- 	<view class="btns" :class="{on:isall}" @click="handleSearch(code)">
					确定
				</view> -->
			</view>
		</view>
		<view class="footer"  v-if="utype!='续料'">
			<view class="items" v-if="btnList[0].cname">
				<view class="tit_flex">
					<view :class="btnList[0].cname?'actd':'d'"></view>
					<view class="texts">产品：</view>
				</view>
				<view class="content">{{btnList[0].cname}}</view>
			</view>
			<view class="items" style="align-items: center;" v-if="btnList[0].cname">
				<view class="tit_flex">
					<view :class="btnList[1].cname?'actd':'d'"></view>
					<view class="texts">产线：</view>
				</view>
				<view class="select">
					<uni-data-select class="" v-model="btnList[1].cname" :localdata="productLineList"
						@change="change($event,1)" :clear='false'></uni-data-select>
				</view>
			</view>
			<view class="items" style="align-items: center;" v-if="btnList[1].cname">
				<view class="tit_flex">
					<view :class="btnList[2].cname?'actd':'d'"></view>
					<view class="texts">设备：</view>
				</view>
				<view class="select">
					<uni-data-select class="" v-model="btnList[2].cname" :localdata="benchList"
						@change="change($event,2)" :clear='false'></uni-data-select>
				</view>
			</view>
			<view class="items" v-if="btnList[2].cname">
				<view class="tit_flex">
					<view :class="btnList[3].cname?'actd':'d'"></view>
					<view class="texts">工位：</view>
				</view>
				<view class="content" :style="{color:btnList[3].cname?'':'#999999'}">
					{{btnList[3].cname ?btnList[3].cname:'输入编码或者扫码'}}
				</view>
			</view>
			<view class="items" style="border-bottom: none;" v-if="btnList[3].cname">
				<view class="tit_flex">
					<view :class="btnList[4].cname?'actd':'d'"></view>
					<view class="texts">物料：</view>
				</view>
				<view class="content">
					<view class="" style="color: red;">
						{{btnList[4].cname}}---{{btnList[4].code}}
					</view>
					<view class="" v-for="(item,index) in materialReplaceList" :key="index">
						{{item.materialName}}---{{item.materialCode}}
					</view>
				</view>
			</view>
		</view>
		<view class="footers" v-else>
			<view class="items" v-if="paramsXl.materialCode" >
				<view class="tit_flex">
					<view class="actd"></view>
					<view class="texts">物料1：</view>
				</view>
				<view class="content">
					{{paramsXl.materialCodeName}}
				</view>
			</view>
			<view class="items" style="border-bottom: none;" v-if="paramsXl.materialCheckCode">
				<view class="tit_flex">
					<view class="actd"></view>
					<view class="texts">物料2：</view>
				</view>
				<view class="content">
					{{paramsXl.materialCheckCodeName}}
				</view>
			</view>
			<view class="items" style="border-bottom: none;" v-if="paramsXl.materialCode && paramsXl.materialCheckCode">
				<view class="tit_flex">
					<view class="actd"></view>
					<view class="texts">对比结果：</view>
				</view>
				<view class="content" v-if="isstatus" style="color: #1DC702;">
					正确 
				</view>
				<view class="content" v-else style="color: red;">
					错误
				</view>
			</view>
		</view>
		<view class="" style="height: 200rpx;">

		</view>
		<view class="botm_btns" @click="allClear" v-if="btnList[0].cname">
			清空
		</view>
		<view class="botm_btns" @click="allClears" v-if="paramsXl.materialCode && paramsXl.materialCheckCode">
			清空
		</view>
		<uni-popup ref="popup" type="center">
			<view class="popup">
				<view class="close" @click="close">
					<uni-icons size="18" type="closeempty"></uni-icons>
				</view>
				<view class="ptitlt">账户信息</view>
				<view class="userinfo">
					<image src="/static/uimg.png" mode=""></image>
					<view class="texts">
						{{uname}}
					</view>
				</view>
				<view class="btn" @click="outlogin">
					退出登录
				</view>
			</view>
		</uni-popup>
		<showToast ref="showToast"></showToast>
	</view>
</template>

<script>
	import {
		getUserinfo,
		logout,
		getProduct,
		getLineList,
		getMaterial,
		checkMaterial,
		getPositionList,
		checkwulaio,
		checkCode,jancCode
	} from '@/common/http.api.js';
	export default {
		data() {
			return {
				statusBarHeight: 0,
				isshow1: false,
				uname: '',
				DepartmentList: [{
						value: 0,
						text: "上料"
					},
					{
						value: 1,
						text: "检测"
					},
					{
						value: 2,
						text: "续料"
					},
				],
				utype: '上料',
				btnList: [{
						id: 1,
						name: '产品',
						cname: '',
						type: 'product'
					},
					{
						id: 2,
						name: '产线',
						cname: '',
						type: 'line'
					},
					{
						id: 3,
						name: '设备',
						cname: '',
						type: 'bench'
					},
					{
						id: 4,
						name: '工位',
						cname: '',
						type: 'position'
					},
					{
						id: 5,
						name: '物料',
						cname: '',
						code: '',
						type: 'material'
					}
				],
				params: {
					type: '上料',
					productCode: '123123', //产品
					lineCode: '', //产线
					benchCode: '', //设备
					positionCode: '', //工位
					materialCode: '', //物料
					materialReplaceCode: '', //替换物料列表
					materialCheckCode: '' //对比物料
				},
				isStep: 0,
				productLineList: [], //产线列表
				benchList: [], //设备列表
				materialReplaceList: [], //替换物料
				gongweiList: [], //工位列表
				index: 0,
				code: '',
				
				
				paramsXl:{
					type: '续料',
					materialCode:'',
					materialCodeName:'',
					materialCheckCode:'',
					materialCheckCodeName:'',
				},
				isstatus:false,
			}
		},
		computed: {
			isall() {
				if (this.code == '') {
					return true
				} else {
					return false
				}
			},
		},
		onLoad() {
			getUserinfo().then(res => {
				this.uname = res.user.nickName
			})
			uni.getSystemInfo({
				success: (res) => {
					this.statusBarHeight = res.statusBarHeight
				}
			})
		},
		methods: {
			changeType(e) {
				this.utype = e.text
				this.isshow1 = false
				this.allClear()
				uni.showToast({
					icon: 'none',
					title: `已切换至${e.text}`
				})
			},
			allClears(){
				this.paramsXl = {
					type: '续料',
					materialCode:'',
					materialCodeName:'',
					materialCheckCode:'',
					materialCheckCodeName:''
				}
			},
			allClear() {
				this.btnList.forEach(item => {
					item.cname = ''
				})
				Object.keys(this.params).forEach((key) => {
					this.params[key] = ''
				})
				this.params.type = this.utype
				this.productLineList = [] //产线列表
				this.benchList = [] //设备列表
				this.materialReplaceList = [] //替换物料
				this.gongweiList = [] //工位列表
				this.code = ''
				this.isStep = 0
				this.index = 0
			},
			//清空除了自己以外的值展示 再清空pasrams不属于自己的字段
			clearCname(index, codeinfo) {
				this.btnList.forEach((item, ind) => {
					if (index < ind) {
						item.cname = ''
						item.code = ''
					}
				})
				this.isStep = index
			},
			arrIndex(arr, key, value) {
				let index = ""
				arr.map((ite, idx) => {
					if (ite[key] == value) {
						index = idx
					}
				})
				return index;
			},

			//扫码
			sm() {
				let that = this
				uni.scanCode({
					barCodeInput: true,
					onlyFromCamera: true,
					autoDecodeCharset:true,
					success: function(res) {
						console.log(res);
						if (res.errMsg == "scanCode:ok") {
							
							if(res.scanType == "CODE_128"){
								let codeinfo = {code: res.result}
								if (that.utype == '续料') {
									that.xuliaoFun(codeinfo.code)
									return
								}
								if (that.btnList[3].cname) {
									that.clearCname(4)
									that.checkWULIAO(codeinfo)
								}
								return
							}else if(res.scanType == "QR_CODE"){
								let codeinfo = ''
								try {
								    // tryCode - 尝试执行代码块
									codeinfo = JSON.parse(res.result)
								}
								catch(err) {
								    // catchCode - 捕获错误的代码块
									console.log(err);
									that.$refs.showToast.open({
										icon: 'info',
										text: '请扫描系统内二维码或条形码'
									})
									return
								}
								finally {
								    // finallyCode - 无论 try / catch 结果如何都会执行的代码块
									 codeinfo = JSON.parse(res.result)
								}
								
								if (that.utype == '续料') {
									let codeinfo = JSON.parse(res.result)
									that.xuliaoFun(codeinfo.code)
									return
								}
								
								let index = that.arrIndex(that.btnList, 'type', codeinfo.type)
								//产品
								if (index == 0) {
									that.clearCname(index)
									that.getCANPIN(codeinfo)
								}
								if (index == 1) {
									const isbe = that.productLineList.some((item) => item.value == codeinfo.code)
									//修改
									if (that.btnList[0].cname) {
										that.clearCname(index)
										that.getCANXIAN(codeinfo)
									}
								}
								if (index == 2) {
									if (that.btnList[1].cname) {
										that.getSHEBEIs(codeinfo)
									}
								}
								if (index == 3) {
									const isActve = that.gongweiList.some((item) => item.positionCode == codeinfo
										.code)
									if (that.btnList[2].cname && isActve) {
										that.index = that.arrIndex(that.gongweiList, 'positionCode', codeinfo.code)
										that.getSHEBEINum(codeinfo)
									} else {
										that.$refs.showToast.open({
											icon: 'info',
											text: `该设备没有【${codeinfo.code}】该工位`
										})
									}
								}
								if (index == 4) {
									if (that.btnList[3].cname) {
										that.clearCname(index)
										that.checkWULIAO(codeinfo)
									}
								}
								if (that.isStep == 0 && index != 0) {
									that.$refs.showToast.open({
										icon: 'info',
										text: '请扫描正确产品码'
									})
								}
								if (that.isStep == 1 && index != 1) {
									that.$refs.showToast.open({
										icon: 'info',
										text: '请扫描正确产线码'
									})
								}
								if (that.isStep == 2 && index != 2) {
									that.$refs.showToast.open({
										icon: 'info',
										text: '请扫描正确设备码'
									})
								}
								if (that.isStep == 3 && index != 3) {
									that.$refs.showToast.open({
										icon: 'info',
										text: '请扫描正确工位码'
									})
								}
								
							}else{
								that.$refs.showToast.open({
									icon: 'info',
									text: '请扫描系统内二维码或条形码'
								})
								
							}
							
						}else{
							that.$refs.showToast.open({
								icon: 'info',
								text: '扫码失败'
							})
						}
					},
					fail: (err) => {
						console.log(err);
					}
				});
			},
			//切换事件
			change(e, type) {
				let codeinfo = {
					code: e
				}
				this.clearCname(type)
				//产线切换
				if (type == 1) {
					this.params.benchCode = ''
					this.index = 0
					this.getCANXIAN(codeinfo)
				} else {
					//设备切换
					this.index = 0
					this.params.positionCode = ''
					this.materialReplaceList = []
					this.params.materialCode = ''
					this.params.materialCheckCode = ''
					this.getSHEBEIs(codeinfo)
				}
			},
			hide() {
				setTimeout(() => {
					uni.hideLoading()
				}, 300)
				this.code = ''
			},
			xuliaoFun(code){
 				if(this.paramsXl.materialCode){
					this.paramsXl.materialCheckCodeName = code
					this.paramsXl.materialCheckCode = code
				}else{
					this.paramsXl.materialCodeName = code
					this.paramsXl.materialCode = code
				}
				if(this.paramsXl.materialCode && this.paramsXl.materialCheckCode){
					jancCode(this.paramsXl).then(res=>{
						if (res.code == 200) {
							this.isstatus = res.data.status
							if (res.data.status) {
								this.$refs.showToast.open({
									icon: 'yes',
									text: '对比成功'
								})
								this.code = ''
								setTimeout(()=>{
									this.paramsXl.materialCode = ''
									this.paramsXl.materialCheckCode = ''
								},1500)
							} else {
								this.$refs.showToast.open({
									icon: 'info',
									text: `对比失败`
								})
								this.code = ''
							}
						} else {
							this.$refs.showToast.open({
								icon: 'err',
								text: res.msg
							})
						}
					})
				}
				this.code = ''
			},
			//编码输入
			handleSearch(code) {
				let that = this
				
				if (code) {
					if (that.utype == '续料') {
						that.xuliaoFun(code)
					} else {
						let codeinfo = {code}
						//产品
						if (that.isStep == 0) {
							that.clearCname(that.isStep)
							that.getCANPIN(codeinfo)
						}
						if (that.isStep == 1) {
							//修改
							if (that.btnList[0].cname) {
								that.clearCname(that.isStep)
								that.getCANXIAN(codeinfo)
							}
						}
						if (that.isStep == 2) {
							if (that.btnList[1].cname) {
								that.getSHEBEIs(codeinfo)
							}
						}
						if (that.isStep == 3) {
							const isActve = that.gongweiList.some((item) => item.positionCode == codeinfo.code)
							if (that.btnList[2].cname && isActve) {
								that.index = that.arrIndex(that.gongweiList, 'positionCode', codeinfo.code)
								that.getSHEBEINum(codeinfo)
							}else{
								this.$refs.showToast.open({
									icon: 'info',
									text: `该设备没有【${codeinfo.code}】该工位`
								})
								this.code = ''
							}
						}
						if (that.isStep == 4) {
							if (that.btnList[3].cname) {
								that.clearCname(that.isStep)
								that.checkWULIAO(codeinfo)
							}
						}
					}
				}
			},
			getCANPIN(codeinfo) {
				this.params.productCode = codeinfo.code
				getProduct(this.params).then(res => {
					if (res.code == 200) {
						this.btnList[this.isStep].cname = res.data.product.productName
						if (this.btnList[this.isStep].cname) {
							this.isStep = 1
						}
						this.productLineList = res.data.productLineList.map(item => {
							return {
								text: item.lineName,
								value: item.lineCode
							}
						})

					} else {
						this.$refs.showToast.open({
							icon: 'info',
							text: res.msg
						})
					}
					this.code = ''
					// this.hide()
				})
			},

			getCANXIAN(codeinfo) {
				this.params.lineCode = codeinfo.code
				getLineList(this.params).then(res => {
					if (res.code == 200) {
						this.btnList[this.isStep].cname = codeinfo.code
						if (this.btnList[this.isStep].cname) {
							this.isStep = 2
						}
						this.benchList = res.data.map(item => {
							return {
								text: item.benchName,
								value: item.benchCode
							}
						})
					} else {
						this.$refs.showToast.open({
							icon: 'info',
							text: res.msg
						})
					}
					this.code = ''
				})
			},

			getSHEBEIs(codeinfo) {
				const isActve = this.benchList.some((item) => item.value == codeinfo.code)
				if (isActve) {
					this.params.benchCode = codeinfo.code
					this.btnList[2].cname = codeinfo.code
					this.getSHEBEINum(codeinfo)
				} else {
					this.$refs.showToast.open({
						icon: 'info',
						text: `该产线没有【${codeinfo.code}】该设备`
					})
				}
				this.code = ''
			},

			//设备有值 自动找到当前设备下第一个工位的物料
			getSHEBEINum(codeinfo) {
				// console.log(codeinfo, '111111', this.gongweiList, this.index);
				// this.gongweiList = []
				getPositionList(this.params).then(res => {
					if (res.code == 200) {
						this.gongweiList = res.data
						if (this.index >= res.data.length) {
							//该设备工位物料已完毕 清空之后的所有值
							this.params.positionCode = ''
							this.params.materialCode = ''
							this.params.materialReplaceCode = ''
							this.params.materialCheckCode = ''
							this.materialReplaceList = []
							this.isStep = 3
							this.btnList[3].cname = ''
							this.btnList[4].code = ''
							this.btnList[4].cname = ''
							this.index = 0
						} else {
							this.isStep = 3
							this.params.positionCode = res.data[this.index].positionCode
							this.btnList[this.isStep].cname = res.data[this.index].positionName
							this.getGONGWEI()
						}
					} else {
						this.$refs.showToast.open({
							icon: 'info',
							text: res.msg
						})
					}
				})
				this.code = ''


			},
			//获取设备下的工位
			getGONGWEI() {
				getMaterial(this.params).then(res => {
					if (res.code == 200) {
						this.isStep = 4
						this.btnList[this.isStep].cname = res.data.material.materialName
						this.btnList[this.isStep].code = res.data.material.materialCode
						this.materialReplaceList = res.data.materialReplaceList
						this.params.materialReplaceCode = res.data.materialReplaceList.map(item => {
							return item.materialCode
						}).join(',')
					}
				})
			},
			checkWULIAO(codeinfo) {
				//扫码code
				this.params.materialCheckCode = codeinfo.code
				//物料code
				this.params.materialCode = this.btnList[this.isStep].code
				//物料对比
				checkMaterial(this.params).then(res => {
					if (res.code == 200) {
						if (res.data.status) {
							this.$refs.showToast.open({
								icon: 'yes',
								text: codeinfo.code
							})
							this.index++
							this.code = ''
							this.getSHEBEINum(codeinfo)
						} else {
							this.$refs.showToast.open({
								icon: 'info',
								text: `对比失败，物料码[${codeinfo.code}]`
							})
							this.code = ''
						}
					} else {
						this.$refs.showToast.open({
							icon: 'err',
							text: res.msg
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.utop {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		padding: 0rpx 20rpx;
		display: flex;
		align-items: center;
		position: fixed;
		z-index: 9999;
		background-color: #fff;

		.u_left {
			display: flex;
			align-items: center;

			image {
				width: 50rpx;
				height: 50rpx;
				border-radius: 25rpx;
			}

			.texts {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #666666;
				margin-left: 15rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				width: 200rpx;
			}
		}
	}

	::v-deep.uni-select {
		width: 160rpx !important;
		height: 30px !important;
		margin-left: 100rpx;
	}

	.smimg {
		margin: 70rpx auto 40rpx;
		width: 440rpx;
		height: 440rpx;

		image {
			width: 440rpx;
			height: 440rpx;
		}
	}

	.popup {
		width: 460rpx;
		height: 420rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 25rpx;
		box-sizing: border-box;

		.close {
			width: 40rpx;
			height: 40rpx;
			position: absolute;
			margin-left: 370rpx;
			text-align: center;
		}

		.ptitlt {
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 28rpx;
			color: #000000;
			text-align: center;
			margin-top: 10rpx;
		}

		.userinfo {
			width: 330rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			border: 1px solid #E5F0FF;
			margin: 40rpx auto;
			padding: 21rpx;
			box-sizing: border-box;
			text-align: center;

			image {
				width: 50rpx;
				height: 50rpx;
				border-radius: 25rpx;
			}

			.texts {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #666666;
				margin-left: 15rpx;
			}
		}

		.btn {
			width: 330rpx;
			height: 80rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			border: 1px solid #B9D7FF;
			text-align: center;
			line-height: 80rpx;
			margin: 0 auto;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 28rpx;
			color: #316FFC;
		}
	}




	.charts_right {
		position: relative;
		width: 160rpx;
		margin-left: 40rpx;
		font-family: PingFang SC;
		font-weight: 500;

		.active_rea {
			font-size: 28rpx;
			border: 1px solid #316FFC;
			box-sizing: border-box;
			color: #316FFC;
			padding: 6rpx 10rpx;
			border-radius: 6rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 60rpx;
			line-height: 60rpx;

			.texts {
				white-space: nowrap;
				overflow: hidden;
			}
		}

		.active_ads {
			position: absolute;
			width: 100%;
			z-index: 9999;
			background-color: #fff;
			border-radius: 0rpx 0rpx 6rpx 6rpx;
			box-shadow: #eee 0px 0px 6px;
			font-size: 28rpx;
			padding: 10rpx;
			box-sizing: border-box;

			.items {
				height: 60rpx;
				line-height: 60rpx;
			}

			.items:active {
				background-color: #B9D7FF;
			}

			.activetext {
				color: #316FFC;
			}
		}
	}





	.btn_block {
		width: 710rpx;
		background: #F8F8F8;
		border-radius: 20rpx;
		margin: 0 auto 41rpx;
		padding: 23rpx 30rpx;
		box-sizing: border-box;

		.items_flex {
			display: flex;
			justify-content: space-between;
			margin-bottom: 17rpx;

			.items {
				width: 110rpx;
				height: 50rpx;
				background: #CEE3FF;
				border-radius: 8rpx;
				text-align: center;
				line-height: 50rpx;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #124BDD;
			}

			.itemsact {
				width: 110rpx;
				height: 50rpx;
				background: #124BDD;
				border-radius: 8rpx;
				text-align: center;
				line-height: 50rpx;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #CEE3FF;
			}
		}

		.input_flex {
			display: flex;

			.input {
				width: 630rpx;
				height: 80rpx;
				background: #FFFFFF;
				border-radius: 10rpx;
				font-size: 28rpx;
				padding-left: 20rpx;
			}

			.btns {
				width: 180rpx;
				height: 80rpx;
				background: #316FFC;
				border-radius: 10rpx;
				text-align: center;
				line-height: 80rpx;
				font-family: PingFang SC;
				font-weight: 800;
				font-size: 28rpx;
				color: #FFFFFF;
			}
		}
	}

	.on {
		background: #316FFC;
		opacity: 0.5;
	}
	.footers {
		border-top: 1px solid #E8E8E8;
		padding-top: 20rpx;
		
		.items {
			width: 670rpx;
			padding: 20rpx 0rpx;
			margin: 0 auto;
			box-sizing: border-box;
			border-bottom: 1px solid #E8E8E8;
			display: flex;
			.tit_flex {
				display: flex;
			}
			.actd {
				width: 16rpx;
				height: 16rpx;
				background: #1DC702;
				border-radius: 50%;
				margin-right: 20rpx;
				margin-top: 14rpx;
			}
			.texts {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 30rpx;
				color: #999999;
			}
			.content {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 30rpx;
				color: #333333;
			}
		}
	}
	.footer {
		border-top: 1px solid #E8E8E8;
		padding-top: 20rpx;

		.items {
			width: 670rpx;
			padding: 20rpx 0rpx;
			margin: 0 auto;
			box-sizing: border-box;
			border-bottom: 1px solid #E8E8E8;
			display: flex;

			.tit_flex {
				display: flex;
				width: 140rpx;
			}

			.actd {
				width: 16rpx;
				height: 16rpx;
				background: #124BDD;
				border-radius: 50%;
				margin-right: 20rpx;
				margin-top: 14rpx;
			}

			.d {
				width: 16rpx;
				height: 16rpx;
				background: #B9D7FF;
				border-radius: 50%;
				margin-right: 20rpx;
				margin-top: 14rpx;
			}

			.texts {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 30rpx;
				color: #999999;
			}

			.content {
				flex: 1;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 30rpx;
				color: #333333;
			}

			.select {
				flex: 1;
			}
		}
	}

	.botm_btns {
		position: fixed;
		right: 30rpx;
		bottom: 100rpx;
		width: 160rpx;
		height: 70rpx;
		text-align: center;
		background: #E4ECFF;
		border-radius: 10rpx;
		border: 1px solid #316FFC;
		font-family: PingFang SC;
		font-weight: 800;
		font-size: 30rpx;
		color: #316FFC;
		line-height: 70rpx;
	}
</style>